<template>
  <div>
    <el-button type="primary" @click="print()">打印</el-button>
    <!-- <div class="print-hidden"> -->
    <Print id="Print" />
    <!-- </div> -->
  </div>
</template>

<script>
import Print from "./components/Print.vue";
// import printJS from "print-js";
export default {
  components: {
    Print,
  },
  mounted() {
    this.$parent.active = "102"
  },
  methods: {
    print() {
      this.$print("#Print", {
        onStart: () => {
          console.log("打印开始");
        },
        onEnd: () => {
          console.log("打印完成");
        },
      });
      // printJS({
      //   printable: "Print",
      //   type: "html",
      //   targetStyles: ["*"], // 需要保留的样式，*代表所有
      //   onPrintDialogClose: () => {
      //     console.log("打印关闭123");
      //   },
      // });
      // let printbox = document.querySelector("#Print").innerHTML;
      // document.querySelector("body").innerHTML = printbox;
      // window.print();
      // // this.cancel();
      // window.location.reload();
    },
  },
};
</script>

<style scoped lang="less">
.print-hidden {
  width: 0;
  height: 0;
  overflow: hidden;
}
</style>
